import React, { Component } from "react";

import "./index.scss";

// 组件
import LoginForm from "./LoginForm";
import RegisterForm from "./RegisterForm";


class Login extends Component {
  constructor(props) {
    super(props);
    this.state = {
        formType: true
    };
  }

  toggleForm = () => {
    this.setState({
        formType: !this.state.formType
    });
  }

  render() {
    return (
      <div className="form-wrap">
        <div>
          <div className="form-header">
            <div className="column">{ this.state.formType ? '登录': '注册' }</div>
            <span onClick={ this.toggleForm }>{ this.state.formType ? '账号注册': '登录' }</span>
          </div>
          <div className="form-content">
            { this.state.formType ? 
            <LoginForm></LoginForm> : 
            <RegisterForm toggleForm={ this.toggleForm }></RegisterForm> }
          </div>
        </div>
      </div>
    );
  }
}

export default Login;
